<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/iconfont.css" />
		<title>团购首页</title>
	</head>
	<body>
		
		<div id="web">
			<!--头部-->
			<header class="clearfix">
				<!--logo-->
				<div class="head_logo fl">
					<img src="img/logo.png" />
				</div>
				<!--搜索框-->
				<div class="search fl">
					<input type="text" name="" id="" value=""/>
					<img src="img/fangdajing.png" />
				</div>
				
				<div class="selettBar fr">
					<select name="">
						<option value="广州">广州市</option>
						<option value="深圳">深圳市</option>
					</select>
				</div>
			</header>
			
			<!--内容-->
			 
		<div class="session">
							 <!--图片 -->
					<div class="picture1">
								<img src="img/big.jpg"/>
					</div>
							
							<!-- 优惠团购 -->
							<div class="preferential">
								
								<div class="pre">
									<div class="picture fl">
										<img src="img/icon1.png"/>
									</div>
									<div class="label fl">
										<a href="#">优惠团购</a>
									</div>
									<div class="more fr">
										<a href="#">更多</a>
										<img src="img/icon2.png"/>
									</div>
									<div class="clear"></div>
								</div>
						
								<div class="introduce">
									<div class="detail1">
										<img src="img/goods.jpg"/>
										
									</div>
									<div class="detail2">
										<img src="img/goods2.jpg"/>
										
									</div>
							
									<div class="detail1">
										<img src="img/goods3.jpg"/>
										
									</div>
									<div class="detail2">
										<img src="img/goods4.jpg"/>
										
									</div>
							</div>
						</div>
						
							<div class="guess">
								<div class="like">
									<div class="pictrueone fl">
										<img src="img/star.png"/>
									</div>
									<div class="labelone fl">
										<a href="#">猜你喜欢</a>
									</div>
									<div class="moreone fr">
										<a href="#">更多</a>
										<img src="img/icon2.png"/>
									</div>
									<div class="clear"></div>
								</div>
						</div>		
								<div class="flower">
									<img src="img/food.jpg" class="fl"/>
									<div class="flower1 fl">
										<div class="wan">
											<a href="Productdetails.html">万岁寿司(正佳店)</a>
											<label>&lt;100m</label>
										</div>
										<div class="set-meal">
											[100店通用]<a href="#">双人套餐</a>
										</div>
										<div class="sale">
											<label>¥88.00</label>
											<label>已售1000</label>
										</div>
									</div>
									<div class="clear"></div>
								</div>
								
								<div class="duck">
									<img src="img/food2.jpg" class="fl"/>
									<div class="duck1 fl">
										<div class="zhou">
											<a href="#">周黑鸭(正佳店)</a>
											<label>&lt;100m</label>
										</div>
										<div class="set-meal">
											[100店通用]<a href="#">双人套餐</a>
										</div>
										<div class="sale">
											<label>¥88.00</label>
											<label>已售1000</label>
										</div>
									</div>
									<div class="clear"></div>
								</div>
								
								<div class="flower">
									<img src="img/food.jpg" class="fl"/>
									<div class="flower1 fl">
										<div class="wan">
											<a href="Productdetails.html">万岁寿司(正佳店)</a>
											<label>&lt;100m</label>
										</div>
										<div class="set-meal">
											[100店通用]<a href="#">双人套餐</a>
										</div>
										<div class="sale">
											<label>¥88.00</label>
											<label>已售1000</label>
										</div>
									</div>
									<div class="clear"></div>
								</div>
								
								<div class="duck">
									<img src="img/food2.jpg" class="fl"/>
									<div class="duck1 fl">
										<div class="zhou">
											<a href="#">周黑鸭(正佳店)</a>
											<label>&lt;100m</label>
										</div>
										<div class="set-meal">
											[100店通用]<a href="#">双人套餐</a>
										</div>
										<div class="sale">
											<label>¥88.00</label>
											<label>已售1000</label>
										</div>
									</div>
									<div class="clear"></div>
								</div>
								
								
							</div>
				
				
			
			</div>
</div>	
			<!--底部-->
			<footer>
				<ul class="clearfix">
					<li>
						<a href="">
							<i class="iconfont icon-path active"></i>
							<p>首页</p>
						</a>
					</li>
					
					<li>
						<a href="classification.html">
							<i class="iconfont icon-classify"></i>
							<p>分类</p>
						</a>
					</li>
					
					<li>
						<a href="found.html">
							<i class="iconfont icon-zhinanzhen"></i>
							<p>发现</p>
						</a>
					</li>
					
					<li>
						<a href="my.html">
							<i class="iconfont icon-user"></i>
							<p>我的</p>
						</a>
					</li>
				</ul>
			</footer>
		</div>
		
		
		
		
		
		   <script>
    
        
		document.body.style.height = window.innerHeight + "px";
		
        /*动态改变根元素字体大小*/
        function recalc() {
            var clientWidth = document.documentElement.clientWidth;
            if(!clientWidth) return;
            document.documentElement.style.fontSize = 40 * (clientWidth / 750) + 'px';
                                        // 字体大小   = 1个rem单位表示多少个像素（设备的宽度   /设计宽度）
        }

        function initRecalc() {
            recalc();
            var resizeEvt = 'osrientationchange' in window ? 'orientationchange' : 'resize';
            if(!document.addEventListener) return;
            window.addEventListener(resizeEvt, recalc, false);
            document.addEventListener('DOMContentLoaded', recalc, false);
        }
        initRecalc();
    
    
    
    </script>
	</body>
</html>
